<template>
	<view class="p-bot140" :style="{'--color':color}">
		<status-bar title='收货地址'></status-bar>
		<view class="row a-center bgwhite padding20 bor_radius_10" @click="chooseAddress">
			<view class="iconfont icon-weixin color_wechat size42"></view>
			<text class="black size26 m-left20">获取微信收货地址</text>
			<view class="iconfont icon-a-zujian7 h6 color_99 j-self-end"></view>
		</view>

		<view class="row a-center bgwhite m-top20 list bor_radius_10" v-for="(item,index) in pageData" :key="index">
			<view class="flex-1 d-flex f-column" @click="saveDefaultAddress(item.id)">
				<text class="black size28 bold500">{{item.Aregion}}{{item.Aaddress}}</text>
				<view class="d-flex a-center m-top20">
					<view class="acquiesce white h7 padding2-10 bor_radius_10 m-right20" v-if="item.is_default == 1">默认
					</view>
					<text class="color_99 h6 m-right16">{{item.Aname}}</text>
					<text class="color_99 h6 ">{{item.Amobile}}</text>
				</view>
			</view>
			<view class="iconfont icon-bianji color_cc size30 edit"
				@click.stop="toUrl(`editAddress?id=${item.id}&bid=${item.bid}&type=2`)"></view>
		</view>

		<emptys empty="address" v-if="!pageData.length"></emptys>

		<view class="Addressbot  white size28 flexac" @click="toUrl(`editAddress?type=1`)">+新增地址</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				pageData: [],
			}
		},
		onShow() {
			this.getAddress();
		},
		methods: {
			async chooseAddress() {
				const addressResult = await this.$pop.chooseAddress();
				if (addressResult) this.getAddress();
			},
			getAddress() { // 获取收货地址
				this.$http.post({
					url: '/zzj_singleSaleApi/getAddress',
				}).then(res => {
					if (!res.data) return;
					this.pageData = res.data;
				})
			},

			addAdress(item) {
				this.$http.post({
					url: '/zzj_singleSaleApi/addAdress',
					data: {
						Aname: item.userName,
						Amobile: item.telNumber,
						Aregion: `${item.provinceName}${item.cityName}${item.countyName}`,
						Aaddress: item.detailInfo,
						is_default: 0
					}
				}).then(res => {
					if (res.code != 100) return this.$Toast(res.msg);
					this.getAddress();
				})
			},

			saveDefaultAddress(id) {
				this.$http.get({
					url: '/zzj_singleSaleApi/saveDefaultAddress',
					data: {
						id
					}
				}).then(res => {
					if (res.code != 100) return this.$Toast(res.msg, 2);
					this.$back();
				})
			}
		},
		computed: {
			...mapState(['color']),
		}
	}
</script>

<style>
	page {
		background-color: #f7f9fa;
		padding: 20rpx 30rpx;
		box-sizing: border-box;
	}
</style>
<style lang="scss" scoped>
	.list {
		padding: 26rpx 0 26rpx 20rpx;
	}

	.edit {
		padding: 20rpx 20rpx 20rpx 40rpx
	}

	.Addressbot {
		width: 690rpx;
		height: 80rpx;
		position: fixed;
		bottom: 100rpx;
		left: 30rpx;
		border-radius: 40rpx;
		z-index: 100;
		background-color: var(--color);
	}

	.acquiesce {
		background-color: var(--color);
	}
</style>